<template>
<view>
<view class="container">
    <view class="userinfo">
        <button @getuserinfo="getUserInfo" open-type="getUserInfo" v-if="!hasUserInfo&&canIUse"> 获取头像昵称 </button>
        <block v-else>
            <image @tap="bindViewTap" class="userinfo-avatar" mode="cover" :src="userInfo.avatarUrl"></image>
            <text class="userinfo-nickname">{{userInfo.nickName}}</text>
        </block>
    </view>
</view>
<view class="container log-list">
    <text v-for="(log, index) in logs" :key="index" class="log-item">{{index+1}}. {{log}}</text>
</view>
</view>
</template>

<script>
function e(e, a, n) {
  return a in e ? Object.defineProperty(e, a, {
    value: n,
    enumerable: !0,
    configurable: !0,
    writable: !0
  }) : e[a] = n, e;
}
var a,
    n = require("../../utils/util.js");

export default {
  data() {
    return {
      userInfo: {},
      hasUserInfo: !1,
      canIUse: uni.canIUse("button.open-type.getUserInfo"),
      logs: []
    };
  },

  components: {},
  props: {},
  onLoad: function () {
    this.setData({
      logs: (uni.getStorageSync("logs") || []).map(function (e) {
        return n.formatTime(new Date(e));
      })
    });
  },
  methods: {
    bindViewTap: function () {
      uni.navigateTo({
        url: "../logs/logs"
      });
    },
    "onLoad": function () {
      var e = this;
      app.userInfo ? this.setData({
        userInfo: app.userInfo,
        hasUserInfo: !0
      }) : this.canIUse ? app.userInfoReadyCallback = function (a) {
        e.setData({
          userInfo: a.userInfo,
          hasUserInfo: !0
        });
      } : uni.getUserInfo({
        success: function (a) {
          app.userInfo = a.userInfo, e.setData({
            userInfo: a.userInfo,
            hasUserInfo: !0
          });
        }
      });
    },
    "getUserInfo": function (e) {
      console.log(e), app.userInfo = e.detail.userInfo, this.setData({
        userInfo: e.detail.userInfo,
        hasUserInfo: !0
      });
    }
  }
};
</script>
<style>
.userinfo {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.userinfo-avatar {
    width: 128rpx;
    height: 128rpx;
    margin: 20rpx;
    border-radius: 50%;
}

.userinfo-nickname {
    color: #aaa;
}

.log-list {
    display: flex;
    flex-direction: column;
    padding: 40rpx;
}

.log-item {
    margin: 10rpx;
}
</style>